<template>
	<div id="app">
		<!-- 这边需要解析支付宝返回回来的支付结果，并调用后端的接口修改订单信息 -->
		<v-app-bar app color="#FF5252">
			<v-list-item-title style="text-align: center;font-size:18px;color:white">支付成功</v-list-item-title>
			<v-btn elevation="0" small color="#FF5252" @click="go_order()" class="go_back">
				<icon name="back" scale="2" color="white"></icon>
			</v-btn>
		</v-app-bar>
		<!-- 需要显示支付凭证 -->
		<div class="no_content">
			<icon name="pay_finish" scale="12"></icon>
			<div style="margin: 0 auto;font-size: 18px;">恭喜您，成功支付房租！</div>
			<div style="margin: 0 auto;font-size: 18px;color: red;">交易号：{{trade_no}}</div>
			<div style="margin: 0 auto;color: gray;">您的房租已经支付成功，请保存好此支付凭证</div>
		</div>
		<v-snackbar v-model="snackbar" bottom :timeout="timeout">
			{{ message }}
		</v-snackbar>
	</div>
</template>

<script>
	import axios from "axios";
	export default {
		name: "PayResult",
		data() {
			return {
				check: false,
				check_two: false,
				real_name: '',
				id_card: '',
				valid: true,
				timeout: 1000,
				snackbar:false,
				message: '',
				trade_no:this.$route.query.trade_no
			}
		},
		methods: {
			go_order() {
				this.$router.push({
					path: "/mine/house_order"
				});
			},
		},
		mounted() {
			console.log(this.$route.query)
			let _this = this;
			axios
				.put("/api/v1.0/order/payment", {
					dict: this.$route.query
				})
				.then(function(response) {
					if (response.data.errno === '0') {
						console.log(response.data.data.pay_url)
					}
				})
				.catch(function() {
					// _this.snackbar = true;
					_this.message = "连接服务器失败！";
				});
		}
	}
</script>

<style scoped>

</style>
